﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="MobileOptimized" content="320">
    <title>无标题文档</title>

    <link href="css/style.css" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" href="css/swiper.min.css">

	<script src="js/swiper.min.js"></script>
    <script src="js/iscroll-probe.js" type="text/javascript"></script>
    <script src="js/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script language="JavaScript" type="text/javascript"> 


     
	   $(function(){
		   //INIT tabs filters
		var filterWidth = 0;
		$("#scroller li").each(function(){
			filterWidth += $(this).width() + 1;
		});
		console.log(filterWidth);
		$("#scroller").css("width",filterWidth);
		var tabScroll = new IScroll('#filters', { scrollX: true, scrollY: false, mouseWheel: true });
	   })
	   
	    $(function(){
		   //INIT tabs filters
		var filterWidth = 0;
		$("#scroller_1 li").each(function(){
			filterWidth += $(this).width() + 1;
		});
		console.log(filterWidth);
		$("#scroller_1").css("width",filterWidth);
		var tabScroll = new IScroll('#filters_1', { scrollX: true, scrollY: false, mouseWheel: true });
	   })
	   


</script> 
<style type="text/css">
    #filters {
        width: 100%;
        overflow: hidden;
    }
    #scroller {
        position: absolute;
        z-index: 1;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-text-size-adjust: none;
        -moz-text-size-adjust: none;
        -ms-text-size-adjust: none;
        -o-text-size-adjust: none;
        text-size-adjust: none;
    }
	

</style>



<!--<script src="js/alloydesigner.js"></script>-->

</head>

<body>

    <div class="wrapper uselect" id="wrapper">

     <div class="content activity singlepage">

        <div class="thead_fixs" style="border:none;">
        	
            
            <!--菜单按钮-->

            <a href="#" class="menu">

                <div class="img">
                	
                	<div class="li"></div>

                </div>

            </a>
            
            <!--菜单按钮end-->
            
            <div class="m">

                <span class="st">叮当派</span>

            </div>

            
            <!--搜索按钮-->

            <a href="#" class=" search">

                <div class="img">
                	
                	<div class="li"></div>

                </div>

            </a>
            
            <!--菜单按钮end-->

            
            <div class="xt_e" style="margin:0;"></div>
            
            <div class="ft" style=" overflow:hidden; display: ;">
            
            	<div class=" lcet " id="filters_1">
                
                    
                    <div class="scroll" id="scroller_1" >
                    
                        <ul class="ul">
                            <li class="select"><a class="sel_1" href="#">精选</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">微课</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">好物</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">活动</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">福利</a></li>
                        </ul>   
                        
                    </div>
                    <div class="xt_bk"></div>
                    
                </div>
            
			</div>
            
        </div>
        
           
        
        
        
        <!--撑起层-->
        
        <div class="thead1">

            <div class="m">

            	<span class="st"> </span>

            </div> 

        </div>
        
        <!--撑起层end-->
        
        
        <div class="ft_tbody ft_active">
        
        <div class="tbody " >
        
        
        	<!--中间层-->
            
            <div class="ft active">
            
                <div class="i_banner">

                    <div class="flicking_con">
                        <a href="#">1</a>
                        <a href="#">2</a>
                        <a href="#">3</a>
                        <a href="#">4</a>
                        <a href="#">5</a>
                    </div>
        
                    <div class="main_image swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide"><img src="images/i_img.jpg" /></div>
                            <div class="swiper-slide"><img src="images/banner1.jpg" /></div>
                            <div class="swiper-slide"><img src="images/banner.jpg" /></div>
                            <div class="swiper-slide"><img src="images/banner1.jpg" /></div>
                            <div class="swiper-slide"><img src="images/banner.jpg" /></div>
                        </div>
                        
                    </div>

                    <div class="swiper-pagination swiper-pagination-bullets"><span class="swiper-pagination-bullet"></span><span class="swiper-pagination-bullet swiper-pagination-bullet-active"></span><span class="swiper-pagination-bullet"></span></div>
                         
                </div>
                
                
                <!--<div class="i_list">
                    
                    <a href="#" class="left">
                    
                        <div class="s1">
                            
                            <div class="t1">活动日历</div>
                            
                        </div>
                        
                        <div class="s2">
                        
                            <div class="img"></div>
                        
                        </div>
                    
                    </a>
                    
                    <a href="#" class="right">
                    
                        <div class="s1">
                            
                            <div class="t1">我的活动</div>
                            
                        </div>
                        
                        <div class="s2">
                        
                            <div class="img"></div>
                        
                        </div>
                    
                    </a>
                    
                    <div class="xt_e" style="margin:0;"></div>
                    <div class="xt_ec_z" style="height:50%; top:20%;"></div>
                    
                </div>-->
                
                
                <div class=" lcet " id="filters">
                
                    
                    <div class="scroll" id="scroller" >
                    
                        
                    
                        <ul class="ul">
                            <li class="select"><a class="sel" href="#">精选</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">微课</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">好物</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">活动</a></li>
                            <li><span class="tj wd" href="#"></span></li>
                            <li class="select"><a class="tj" href="#">福利</a></li>

                        </ul>   
                        
                    </div>
                    <div class="xt_bk"></div>
                    
                </div>
            
            
            </div>
			
            <!--中间层end-->
			<div class="bgcolor bg" style="margin-top:2%;">
			
                <a href="#">
                
                   <div class="infor">
                
                      <div class="item">
                
                          <div class="img">
                
                              <span class="img"><img src="images/act6.jpg"></span>
                              
                          </div>
                
                          <div class="wd"  style="max-width: 550px;">
                
                              <span class="st">生态学博士带队，自然博物馆</span>
                
                              <span class="time">2015.04.3~2016.05.01·海豚湾剧场</span>
                
                              <span class="time" >
                
                                  <span class="s2" >叮当派</span>
                
                              </span>
                
                              <span class="t_user">
                              
                                 <div class="x1">
                              
                                    <div class="user"><span class="s2">火热报名中</span></div>
                              
                                 </div> 
                              
                              <!--<span class="s1" ><span class="s2">火热报名中</span></span>-->
                              
                              </span> 
                
                          </div>
                
                      </div>
                
                   </div>
                
                </a>

             	<div class="xt_d"></div>
        
             	<a href="#">
        
                    <div class="infor">
                    
                        <div class="item">
                      
                            <!--<a href="#" class="imgs">官 方</a>-->
                            <div class="img">
                      
                                <span class="img"><img src="images/act6.jpg"></span>
                      
                            </div>
                      
                            <div class="wd"  style="max-width: 550px;">
                      
                                <span class="st">余德耀美术馆《雨雾亚洲首展》如果文案有两行</span>
                      
                                <!--<span class="st1">上海二十一世纪民生美术馆开馆大展多重宇宙</span>-->
                      
                                <span class="time">04月3日-05月01日·海豚湾剧场</span>
                      
                                <span class="time" >
                      
                                    <span class="s2" >叮当派</span>
                      
                                </span>
                      
                                <span class="t_user">
                      
                                    <div class="x1">
                      
                                        <div class="user">报名截止</div>
                      
                                    </div> 
                      
                                </span> 
                      
                            </div>
                      
                        </div>
                    
                    </div>
        
        		</a>
        
        		<div class="xt_d"></div>
        
        		<a href="#">
        
                    <div class="infor">
            
                        <div class="item">
            
                            <div class="img">
                
                                <span class="img"><img src="images/act6.jpg"></span>
                
                            </div>
                
                            <div class="wd"  style="max-width: 550px;">
                
                                <span class="st">生态学博士带队，自然博物馆深度游</span>
                    
                                <span class="time">04月3日-05月01日</span>
                    
                                <span class="time" >
                    
                                    <span class="s2" >叮当派</span>
                    
                                </span>
                
                                <span class="t_user">
                
                                    <div class="x1">
                    
                                        <div class="user">已满额</div>
                    
                                    </div> 
                
                                </span> 
                
                            </div>
            
                        </div>
            
                    </div>
        
        		</a>
        
        		<div class="xt_d"></div>
        
        		<a href="#">
        
                    <div class="infor">
            
                        <div class="item">
                
                        <!--<a href="#" class="imgs">官 方</a>-->
                            <div class="img">
                    
                                <span class="img"><img src="images/act6.jpg"></span>
                    
                            </div>
                    
                            <div class="wd"  style="max-width: 550px;">
                    
                                <span class="st">生态学博士带队，自然博物馆深度游</span>
                  
                                <span class="time">04月3日-05月01日</span>
                    
                                <span class="time" >
                    
                                    <span class="s2" >叮当派</span>
                    
                                </span>
                    
                                <span class="t_user">
                    
                                    <div class="x1">
                        
                                        <div class="user">32人已报名</div>
                        
                                    </div> 
                    
                                </span> 
                    
                            </div>
                
                        </div>
            
                    </div>
        
        		</a>
        
        		<div class="xt_d"></div>
        
        		<a href="#">
        
                    <div class="infor">
            
                        <div class="item">
    
                            <div class="img">
                
                                <span class="img"><img src="images/act6.jpg"></span>
                
                            </div>
                
                            <div class="wd"  style="max-width: 550px;">
                
                                <span class="st">生态学博士带队，自然博物馆深度游</span>
                    
                                <span class="time">04月3日-05月01日</span>
                    
                                <span class="time" >
                    
                                    <span class="s2" >叮当派</span>
                    
                                </span>
                    
                                <span class="t_user">
                    
                                    <div class="x1">
                        
                                        <div class="user">32人已报名</div>
                        
                                    </div> 
               
                                </span> 
                
                            </div>
            
                        </div>
            
                    </div>
        
        		</a>
        
        		<div class="xt_d"></div>
        
        		<a href="#">
        
                    <div class="infor">
            
                        <div class="item">
        
                            <div class="img">
                    
                                <span class="img"><img src="images/act6.jpg"></span>
                    
                            </div>
                    
                            <div class="wd"  style="max-width: 550px;">
                    
                                <span class="st">生态学博士带队</span>
                    
                                <!--<span class="st1">上海二十一世纪民生美术馆开馆大展多重宇宙</span>-->
                    
                                <span class="time">04月3日-05月01日</span>
                    
                                <span class="time" >
                    
                                    <span class="s2" >叮当派</span>
                    
                                </span>
                    
                                <span class="t_user">
                    
                                    <div class="x1">
                        
                                        <div class="user">32人已报名</div>
                        
                                    </div> 
                    
                                </span> 
                    
                            </div>
                
                        </div>
            
                    </div>
        
        		</a>
        
        		<div class="xt_d"></div>
        
        		<a href="#">
        
                    <div class="infor">
            
                        <div class="item">
        
                            <div class="img">
                    
                                <span class="img"><img src="images/act6.jpg"></span>
                    
                            </div>
                    
                            <div class="wd"  style="max-width: 550px;">
                    
                                <span class="st">生态学博士带队</span>
                    
                                <!--<span class="st1">上海二十一世纪民生美术馆开馆大展多重宇宙</span>-->
                    
                                <span class="time">04月3日-05月01日</span>
                    
                                <span class="time" >
                    
                                    <span class="s2" >叮当派</span>
                    
                                </span>
                    
                                <span class="t_user">
                    
                                    <div class="x1">
                        
                                        <div class="user">32人已报名</div>
                        
                                    </div> 
                    
                                </span> 
                    
                            </div>
                
                        </div>
            
                    </div>
        
        		</a>

            </div>
            
            
            
    
    	</div>

		</div>




</div>
</div>


</body>

<script>
	var contentSwiper = new Swiper('.swiper-container');
	
</script>

</html>
